<template>
  <Header />

  <div class="main box_center cf">
    <div class="userBox cf">
      <SetupList/>

      <router-view v-slot="{Component}">
        <keep-alive>
          <component :is="Component"/>
        </keep-alive>
      </router-view>
    </div>
  </div>
  <Footer />
</template>

<script>
import "@/assets/styles/user.css";
import Header from "@/components/common/Header";
import Footer from "@/components/common/Footer";
import SetupList from "@/components/user/MenuList";
export default {
  name: "userSetup",
  components: {
    Header,
    Footer,
    SetupList
  },
};
</script>

<style>
.avatar-uploader .avatar {
  width: 178px;
  height: 178px;
  display: block;
}
</style>

<style>
.avatar-uploader .el-upload {
  border: 1px dashed var(--el-border-color);
  border-radius: 6px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
  transition: var(--el-transition-duration-fast);
}

.avatar-uploader .el-upload:hover {
  border-color: var(--el-color-primary);
}

.el-icon.avatar-uploader-icon {
  font-size: 28px;
  color: #8c939d;
  width: 178px;
  height: 178px;
  text-align: center;
}
</style>